<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link rel="stylesheet" th:href="@{/bootstrap/css/bootstrap.min.css}"/>
<script type="text/javascript" th:src="@{/js/jquery-2.2.3.min.js}"></script>
<script type="text/javascript" th:src="@{/bootstrap/js/bootstrap.min.js}"></script>
<script type="text/javascript" th:src="@{/js/user-info.js}"></script>
<title>新增用户</title>
<style type="text/css">
	.inputText{width: 430px !important;}
	.rowDiv{margin-bottom: 15px;}
	.form-lavel{width: 80px;text-align: right;}
</style>
</head>
<body>
	<div class="container" style="width: 100%;padding: 25px 15px;">
		<div class="row clearfix">
			<div class="col-md-12 column" style="padding: 20px;padding-top: 0px;">
				<form action="#" method="post" id="userForm" enctype="multipart/form-data" role="form" class="form-inline" style="margin-bottom: 10px;">
					<div id="userInfoDiv" class="form" style="padding:5px;">
						<div class="row rowDiv">
							<div class="col-sm-6">
								<div class="form-group">
									<label class="form-lavel" for="username">账号：</label>
									<input type="text" class="form-control inputText" id="username" name="employee.username" placeholder="字母开头，6-21位">
									<span style="color: red;">*</span>
									<span id="usernameError" class="errorInfo" style="color: red;"></span>
								</div>
							</div>
							<div class="col-sm-6">
								<div class="form-group">
									<label class="form-lavel" for="name">姓名：</label>
									<input type="text" class="form-control inputText" id="name" name="employee.name" placeholder="最长11位的中文名">
									<span style="color: red;">*</span>
									<span id="nameError" class="errorInfo" style="color: red;"></span>
								</div>
							</div>
						</div>
						<div class="row rowDiv">
							<div class="col-sm-6">
								<div class="form-group">
									<label class="form-lavel" for="password">密码：</label>
									<input type="password" class="form-control inputText" id="password" name="employee.password" placeholder="数字和字母，6-21位">
									<span style="color: red;">*</span>
									<span id="passwordError" class="errorInfo" style="color: red;"></span>
								</div>
							</div>
							<div class="col-sm-6">
								<div class="form-group">
									<label class="form-lavel" for="cpassword">确认密码：</label>
									<input type="password" class="form-control inputText" id="cpassword" name="confirmPassword" placeholder="请确认密码">
									<span style="color: red;">*</span>
									<span id="confirmPasswordError" class="errorInfo" style="color: red;"></span>
								</div>
							</div>
						</div>
						<div class="row rowDiv">
							<div class="col-sm-6">
								<div class="form-group">
									<label class="form-lavel" for="gender">性别：</label>
									<input type="radio" name="employee.gender" checked="checked" value="男"/>男&nbsp;&nbsp;&nbsp;&nbsp;
									<input type="radio" name="employee.gender" value="女"/>女&nbsp;&nbsp;&nbsp;&nbsp;
									<span style="color: red;">*</span>
								</div>
							</div>
							<div class="col-sm-6">
								<div class="form-group">
									<label class="form-lavel">部门：</label>
									<select class="form-control" id="roleId" name="department.d_id">
										<option th:each="dep:${deps}" th:value="${dep.d_id}">[[${dep.d_name}]]</option>
									</select>
									<span style="color: red;">*</span>
								</div>
							</div>
						</div>
						<div class="row rowDiv">
							<div class="col-sm-6">
								<div class="form-group">
									<label class="form-lavel" for="tellphone">手机号：</label>
									<input type="text" class="form-control inputText" id="tellphone" name="employee.tellphone" placeholder="请输入真实手机号">
									<span style="color: red;">*</span>
									<span id="tellphoneError" class="errorInfo" style="color: red;"></span>
								</div>
							</div>
							<div class="col-sm-6">
								<div class="form-group">
									<label class="form-lavel" for="email">邮箱：</label>
									<input type="text" class="form-control inputText" id="email" name="employee.email" placeholder="请输入真实邮箱">
									<span style="color: red;">*</span>
									<span id="emailError" class="errorInfo" style="color: red;"></span>
								</div>
							</div>
						</div>
						<div class="row rowDiv">
							<div class="col-sm-6">
								<div class="form-group">
									<label class="form-lavel" for="birthday">生日：</label>
									<input type="date" class="form-control inputText" id="birthday" name="employee.birthday" placeholder="生日,如：1997-01-12">
									<span style="color: red;">*</span>
									<span id="birthdayError" class="errorInfo" style="color: red;"></span>
								</div>
							</div>
							<div class="col-sm-6">
								<div class="form-group">
									<label class="form-lavel" for="idcard">身份证：</label>
									<input type="text" class="form-control inputText" id="idcard" name="employee.idcard" placeholder="支持15或18位">
									<span style="color: red;">*</span>
									<span id="idcardError" class="errorInfo" style="color: red;"></span>
								</div>
							</div>
						</div>
						<div class="row rowDiv">
							<div class="col-sm-6">
								<div class="form-group">
									<label class="form-lavel">所属职位：</label>
									<select class="form-control" id="roleId" name="job.j_id">
										<option th:each="job:${jobs}" th:value="${job.j_id}">[[${job.j_name}]]</option>
									</select>
								</div>
							</div>
							<div class="col-sm-6">
								<div class="form-group">
									<label class="form-lavel" for="pstatus">员工状态：</label>
									<select class="form-control" id="pstatus" name="pstatus">
										<option value="试用期">试用期</option>
										<option value="转正">转正</option>
										<option value="离职">离职</option>
									</select>
								</div>
							</div>
						</div>
						<div class="row rowDiv">
							<div class="col-sm-6">
								<div class="form-group">
									<label class="form-lavel" for="pentrytime">入职日期：</label>
									<input type="date" class="form-control inputText" id="pentrytime" name="pentrytime" placeholder="入职日期，如：2017-01-01">
									<span style="color: red;">*</span>
									<span id="pentrytimeError" class="errorInfo" style="color: red;"></span>
								</div>
							</div>
							<div class="col-sm-6">
								<div class="form-group">
									<label class="form-lavel">头像：</label>
										<input type="file" name="iconfile">
								</div>
							</div>
						</div>
							<div class="row">
								<div class="col-sm-12">
									<div class="form-group">
										<input type="button" class="btn btn-primary btn" value="提交" th:onclick="'javascript:userAdd(\''+@{/personnel/add}+'\');'" />
										<span id="systemError" class="errorInfo" style="color: red;"></span>
									</div>
								</div>
							</div>
					</div>
				</form>
			</div>
		</div>
	</div>
	<div class="modal fade" id="emailVcodeModal" >
	  <div class="modal-dialog">
	    <div class="modal-content">
	      <!-- 模态框头部 -->
	      <div class="modal-header">
	        <h4 class="modal-title">请输入邮箱验证码</h4>
	        <button type="button" class="close" data-dismiss="modal">&times;</button>
	      </div>
	      <!-- 模态框主体 -->
	      <div class="modal-body">
	      	<input type="text" id="emailVcode"/>
	      </div>
	      <!-- 模态框底部 -->
	      <div class="modal-footer">
	      	<span id="vcodeInfo"></span>
	        <button type="button" class="btn btn-secondary"  th:onclick="'javascript:addconfirm(\''+@{/personnel/addconfirm}+'\');'">提交</button>
	      </div>
	    </div>
	  </div>
	</div>
</body>
<script type="text/javascript">
	$(function(){
		$("#emailVcodeModal").modal("hide");
	});
</script>
</html>